import React 			from 'react';
import ReactDom 		from 'react-dom';
import { BrowserRouter as Router ,Switch,Route,Link,Redirect } from 'react-router-dom';
import Home 		     from 'page/home/index.jsx';
import Login 		     from 'page/login/index.jsx';
import ErrorPage 	   	 from 'page/error/index.jsx';
import UserList 	   	 from 'page/user/index.jsx';
import OrderList		 from 'page/order/index.jsx';
import OrderDetail		 from 'page/order/detail.jsx';
import Layout 		   	 from 'component/layout/index.jsx';
import ProductRouter 	 from 'page/product/router.jsx';


class App extends React.Component{
	render(){
		const LayoutRouter = (
			<Layout>
				<Switch>
					<Route exact path='/' component={Home} ></Route>
					<Route path='/product' component={ProductRouter} ></Route>
					<Route path='/product-category' component={ProductRouter} ></Route>
					<Route path='/order/index' component={OrderList} ></Route>
					<Route path='/order/detail/:orderNo' component={OrderDetail} ></Route>
					<Route path='/user/index' component={UserList} ></Route>
					<Redirect from='/user' 	to='/user/index'></Redirect>
					<Redirect from='/order' to='/order/index'></Redirect>
					<Route component={ErrorPage} ></Route>
				</Switch>
			</Layout>
		);
		return (
			<Router>
				<Switch>
					<Route  path='/login' component={Login} ></Route>
					<Route  path='/' render={prop => LayoutRouter} ></Route>
				</Switch>
			</Router>
		)
	}
}

ReactDom.render(
				<App />,
				document.getElementById("app")
				);